<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>M3U8播放器</title>
    <link rel="stylesheet" href="index.css">
    <script src="hls.min.js"></script>
</head>
<body>
    <div class="container">
        <div class="input-group">
            <input type="text" id="m3u8-url" placeholder="请输入m3u8地址" value="https://svip.high24-playback.com/20241018/8326_823a284e/index.m3u8">
            <button id="play-btn">播放</button>
            <button id="scan-btn">扫描</button>
            <!-- 添加去广告开关 -->
            <label>
                <input type="checkbox" id="ad-remove-switch" checked> 去除广告
            </label>
        </div>
        <div class="main-content">
            <div class="ts-list-container">
                <h3>TS 文件列表</h3>
                <ul id="ts-list" class="ts-list"></ul>
            </div>
            <div class="player-container">
                <video id="video-player" controls></video>
                <!-- 删除 ts-info 元素 -->
                <!-- <div id="ts-info" class="ts-info"></div> -->
            </div>
        </div>
        <div class="url-list-container"></div>
            <div class="url-list-header">
                <span>检测到的M3U8地址：</span>
                <span class="url-count">(0)</span>
            </div>
            <ul id="url-list" class="url-list"></ul>
        </div>

        <div id="loading" class="loading hidden">
            <div class="spinner"></div>
            <div class="progress-text">处理中...</div>
        </div>
    </div>
    <script src="index.js"></script>
</body>
</html>